import {useState} from 'react'
import { useList } from '../../context/ListProvider';
import { ADD_ITEM } from '../../reducers/list-reducer';

const AddItem = () => {
    const {dispatch} = useList();
    const [value, setValue] = useState();
    const onChange = e => setValue(e.target.value);
    const add = () => {
        dispatch({ type: ADD_ITEM, value});
    }
    return (
        <div>
            <input
                value={value} 
                type="text" 
                onChange={onChange}
            />
            <button onClick={add}>添加</button>
        </div>
    )
}

export default AddItem